<template>
    <div class="breadcrumb">
        <div class="title">{{title||caption}}</div>
        <div class="operat">
            <slot></slot>
            <el-button size="small" @click="back" v-if="!noBack">返回</el-button>
        </div>
    </div>
</template>

<script>
    export default {
        name: '',
        props: ['title', 'noBack'],
        data() {
            return {
                caption: ''
            }
        },
        mounted() {
            if (!this.title) this.caption = window.document.title
        },
        methods: {
            back() {
                this.$emit('back')
                this.$method.historyBack()
            }
        },
        components: {}
    }
</script>

<style scoped lang="less">
    .breadcrumb {
        display: flex;
        align-items: center;
        > * {
            flex: auto;
        }
        .title {
            font-size: 16px;
            font-weight: bold;
        }
        .operat {
            text-align: right;
        }
    }
</style>
